{{extend 'layout.html'}}
<script>
    $(function() {
        $("table#committees").tablesorter({ sortList: [[0,0]] , 
            headers: {
                4: { sorter: false }
            }
        });

    });
</script>
<table id="committees" class="zebra-striped">
    <thead>
        <tr>
            {{headers = ["Committee", "Start Date", "End Date", "Position",
            "Actions"]}}
            {{for h in headers:}}
            <th class="header">{{=h}}</th>
            {{pass}}
        </tr>
    </thead>
    <tbody>
        <!-- TODO: this should use CommitteeMemberEntity -->
        {{for committee in committees:}}
        {{committee_names.remove(committee['name'])}}
        {{id = committee['id']}}
        <tr>
            <td>
                {{=committee['name']}}
            </td>
            <td>
                {{=committee['started']}}
            </td>
            <td>
                {{=committee['ended']}}
            </td>
            <td>
                {{=committee['position']}}
            </td>
            <td>
                <a class="small btn info" 
                    href="{{=URL('committees','view',args=(id))}}"
                    id="view_{{=id}}">view</a> 
                {{if committee['active']:}}
                <a class="small btn danger" 
                    id="quit_{{=id}}" 
                    href="{{=URL('committees','quit',args=(id))}}">quit</a>
                {{else:}}
                <a class="small btn success" 
                    href="{{=URL('commmittees','join',args=(id))}}"
                    id="join_{{=id}}">join</a> 
                {{pass}}
            </td>
        </tr>
        {{pass}}


    </tbody>
</table>


